<script type="text/javascript"><!--//--><![CDATA[//><!--
var LOVKontrak3 = function(ao_option){
	try{
		if(ao_option==undefined){ ao_option={}; }
		var lf_onSelect	= (ao_option.onSelect==undefined || typeof(ao_option.onSelect)!='function') ? function(){} : ao_option.onSelect;
		
		// Create Popup
		var $popup	= openPopup({ title:'Daftar Kontrak' , width:700, height:370 });
		var ls_id	= $popup.attr('id');
		
		// Append Datagrid Container
		var ls_gridName	= 'grid_'+ls_id;
		$popup	.html(	$('<div>')	.attr('id', 'tb'+ls_id).attr('style','padding:5px;height:auto;')
									.html(	$('<div>').html($('<form>')	.attr('id','fm_search_'+ls_id).data('rel',ls_id).submit(function(e){ $('#'+ls_gridName).datagrid('reload', $('#fm_search_'+$(this).data('rel')).serializeObject()); e.preventDefault(); })
																		.html('<table class="tb_form" style="margin-bottom:0px"><tr><td width="100">Keyword</td><td><input type="text" name="keyword" class="textfield medium" /><a href="#" class="easyui-linkbutton" iconCls="icon-search" id="btn_search'+ls_id+'" rel="'+ls_id+'">Search</a></td></tr></table>')
															)
											)
						)
				.append($('<div>').attr('id', ls_gridName).attr('toolbar', '#tb'+$popup.attr('id')));
		
		$('#btn_search'+ls_id).click(function(){ $('#'+ls_gridName).datagrid('reload', $('#fm_search_'+$(this).attr('rel')).serializeObject()); return false; });
		$('#btn_search'+ls_id).linkbutton({  
			plain:true  
		}); 
		
		// Build Datagrid
		var ls_param = (ao_option.param==undefined ? '' : ao_option.param);
		$('#'+ls_gridName).datagrid({  
			url:gs_path+'/isp_customer_kontrak/getdata2/'+ls_param,
			queryParams: $('#fm_search_'+ls_id).serializeObject(),
			height:337,
			pagination:true,
			singleSelect:true,
			columns:[[
				{ field : 'no_id', title : 'ID Kontrak', width : 170, sortable:true },
				{ field : 'kode_kontrak', title : 'Kode Kontrak', width : 170, sortable:true },
				{ field : 'kode_customer', title : 'Kode Client', width : 170, sortable:true },
				{ field : 'nama_customer', title : 'Nama Client', width : 170, sortable:true },
				{ field : 'nama_jenis_barang', title : 'Nama Jenis Barang', width : 170, sortable:true },
				{ field : 'bandwidth', title : 'Bandwith', width : 170, sortable:true },
				{ field : 'harga', title : 'Abodemen', width : 170, sortable:true },
			]],
			onSelect:function(rowIndex, rowData){ lf_onSelect(rowData); closePopup(); }
		});
		
	} catch (err) { alert('Func. LOVSampleReference :\n' + err); }
};

	var grid_reload = function(){
		$('#datagrid').datagrid('reload', $('#fm_search').serializeObject());
	};

	function terbilang(bilangan) {
 
		 bilangan    = String(bilangan);
		 var angka   = new Array('0','0','0','0','0','0','0','0','0','0','0','0','0','0','0','0');
		 var kata    = new Array('','Satu','Dua','Tiga','Empat','Lima','Enam','Tujuh','Delapan','Sembilan');
		 var tingkat = new Array('','Ribu','Juta','Milyar','Triliun');
		 
		 var panjang_bilangan = bilangan.length;
		 
		 /* pengujian panjang bilangan */
		 if (panjang_bilangan > 15) {
		   kaLimat = "Diluar Batas";
		   return kaLimat;
		 }
		 
		 /* mengambil angka-angka yang ada dalam bilangan, dimasukkan ke dalam array */
		 for (i = 1; i <= panjang_bilangan; i++) {
		   angka[i] = bilangan.substr(-(i),1);
		 }
		 
		 i = 1;
		 j = 0;
		 kaLimat = "";
		 
		 
		 /* mulai proses iterasi terhadap array angka */
		 while (i <= panjang_bilangan) {
		 
		   subkaLimat = "";
		   kata1 = "";
		   kata2 = "";
		   kata3 = "";
		 
		   /* untuk Ratusan */
		   if (angka[i+2] != "0") {
		     if (angka[i+2] == "1") {
		       kata1 = "Seratus";
		     } else {
		       kata1 = kata[angka[i+2]] + " Ratus";
		     }
		   }
		 
		   /* untuk Puluhan atau Belasan */
		   if (angka[i+1] != "0") {
		     if (angka[i+1] == "1") {
		       if (angka[i] == "0") {
		         kata2 = "Sepuluh";
		       } else if (angka[i] == "1") {
		         kata2 = "Sebelas";
		       } else {
		         kata2 = kata[angka[i]] + " Belas";
		       }
		     } else {
		       kata2 = kata[angka[i+1]] + " Puluh";
		     }
		   }
		 
		   /* untuk Satuan */
		   if (angka[i] != "0") {
		     if (angka[i+1] != "1") {
		       kata3 = kata[angka[i]];
		     }
		   }
		 
		   /* pengujian angka apakah tidak nol semua, lalu ditambahkan tingkat */
		   if ((angka[i] != "0") || (angka[i+1] != "0") || (angka[i+2] != "0")) {
		     subkaLimat = kata1+" "+kata2+" "+kata3+" "+tingkat[j]+" ";
		   }
		 
		   /* gabungkan variabe sub kaLimat (untuk Satu blok 3 angka) ke variabel kaLimat */
		   kaLimat = subkaLimat + kaLimat;
		   i = i + 3;
		   j = j + 1;
		 
		 }
		 
		 /* mengganti Satu Ribu jadi Seribu jika diperlukan */
		 if ((angka[5] == "0") && (angka[6] == "0")) {
		   kaLimat = kaLimat.replace("Satu Ribu","Seribu");
		 }
		 
		 return kaLimat + "Rupiah";
	}

	
	$(document).ready(function() {

		// Setup Datagrid
		$('#datagrid').datagrid({  
			url:gs_path+'/'+controller+'/getdata', 
			queryParams: $('#fm_search').serializeObject(),
			height:340,
			pagination:true,
			columns:[[
				{ field : 'ck', checkbox:true, width: 40, align: 'center' },
				{ field : 'no_invoice', title : 'No Invoice', width : 170, sortable:true },
				{ field : 'kode_kontrak', title : 'Kode Kontrak', width : 170, sortable:true },
				{ field : 'kode_customer', title : 'Kode Client', width : 120, sortable:true },
				{ field : 'no_invoice', title : 'No Invoice', width : 170, sortable:true },
				{ field : 'periode_tagihan', title : 'Periode Tagihan', width : 100, sortable:true },
				{ field : 'tanggal_invoice', title : 'Tanggal Invoice', width : 100, sortable:true },
				{ field : 'due_date', title : 'Due Date Invoice', width : 100, sortable:true },
				{ field : 'status', title : 'Status', width : 100, sortable:true },
				{ field : 'total', title : 'Total Bayar', width : 100, sortable:true },	
				{ field : 'tanggal_bayar', title : 'Tanggal Bayar', width : 100, sortable:true },
				{ field : 'keterangan', title : 'Keterangan', width : 150, sortable:true }
			]]
		});		
		
		// Setup Form
		$('#form_master').setupForm([			
			{ name: 'kode_kontrak', type: 'lov', size: 'medium',noempty:true,
				onClearButton:function(){
					$(this).setval('');
					$('#kode_customer').setval(''); 
					$('#nama_customer').setval('');
					$('#abodemen').setval(''); 
				},
				onActionButton:function(){ 
					LOVKontrak3({ onSelect:function(row){ 
						$('#id_kontrak').setval(row.no_id); 
						$('#kode_kontrak').setval(row.kode_kontrak); 
						$('#kode_customer').setval(row.kode_customer);
						$('#nama_customer').setval(row.nama_customer);
						$('#nama_jenis_barang').setval(row.nama_jenis_barang);
						$('#bandwidth').setval(row.bandwidth);
						$('#abodemen').setval(row.harga);
						$('#biaya_pendaftaran').setval(0);

						var ppn = parseFloat(row.harga * 0.1);
						var total = parseFloat(row.harga) + ppn;

						$('#ppn').setval(ppn);
						$('#total').setval(total);
						$('#terbilang').setval(terbilang(total));


					} }); 
				}
			},
			{ name: 'kode_customer', type: 'text', size: 'medium', maxlength: 255,readonly:true},
			{ name: 'nama_customer', type: 'text', size: 'medium', maxlength: 255, readonly:true  },
			{ name: 'nama_jenis_barang', type: 'text', size: 'long', maxlength: 255, readonly:true  },
			{ name: 'bandwidth', type: 'text', size: 'medium', maxlength: 255, readonly:true  },
			{ name: 'abodemen', type: 'text', size: 'medium', maxlength: 255},
			{ name: 'total', type: 'text', size: 'medium', maxlength: 40, readonly:true },
			{ name: 'ppn', type: 'text', size: '15', maxlength: 40 },
			{ name: 'input_ppn', type: 'text', size: '3', maxlength: 40},
			{ name: 'terbilang', type: 'text', size: 'long', maxlength: 40, readonly:true },
			{ name: 'no_invoice', type: 'text', size: 'long', maxlength: 50, noempty:true },
			{ name: 'tanggal_invoice', type:'date', size: 'medium', noempty:true/*, value:new Date()*/ },
			{ name: 'status', type: 'text', size: 'medium', maxlength: 40, noempty:true },			
			{ name: 'biaya_pendaftaran', type: 'text', size: 'medium', maxlength: 40 },
			{ name: 'tanggal_bayar', type: 'date', size: 'medium', maxlength: 40/*, value:new Date()*/ },
			{ name: 'periode_bulan', type: 'text', size: 'short', maxlength: 40 },
			{ name: 'periode_tahun', type: 'text', size: 'short', maxlength: 40 },
			{ name: 'due_date', type: 'date', size: 'medium', maxlength: 40 },
			{ name: 'keterangan', type: 'textarea', size:'long', rows:3 },
			{ name: 'urutan', value:'1', type: 'text', size: 'long', maxlength: 255 }	

		]);
		
		$('#abodemen').keyup(function() {
			var abodemen =  parseInt($('#abodemen').val());
			var input_ppn =  parseInt($('#input_ppn').val());
			var ppn = abodemen * input_ppn / 100;
			$('#ppn').setval(ppn);
			var total = abodemen + ppn;
			$('#total').setval(total);
			$('#terbilang').setval(terbilang(total));
		});

		$('#input_ppn').keyup(function(){
			var abodemen =  parseInt($('#abodemen').val());
			var input_ppn =  parseInt($('#input_ppn').val());
			var ppn = abodemen * input_ppn / 100;
			$('#ppn').setval(ppn);
		});

		$('#biaya_pendaftaran').keyup(function() {
			var pendaftaran =  parseInt($('#biaya_pendaftaran').val());
			var abodemen =  parseInt($('#abodemen').val());
			var ppn = parseInt($('#ppn').val());
			//$('#ppn').setval(ppn);
			var total = abodemen + pendaftaran +ppn;
			$('#total').setval(total);
			$('#terbilang').setval(terbilang(total));
		});
		
		
		// Create Dialog
		$('#dialog_container').dialog({
			closed:true,
			modal:true,
			title: '_',
			width:600,
			height: 600,
			buttons:[{
				text:'Save',
				iconCls:'icon-save',
				handler:function(){
					$('#form_master').submitForm('/'+controller+'/ajax_post', { onComplete : function(){ $('#dialog_container').dialog('close'); $('#datagrid').datagrid('reload'); }} );
					//loadPage(gs_path + '/' + controller + '/index/');
				}
			},{
				text:'Close',
				iconCls:'icon-cancel',
				handler:function(){
					$('#dialog_container').dialog('close');
				}
			}]
		});
		
		
		// Set Action Button
		var buttons = [ { label: 'Add', icon: 'add', onclick: function() {
							resetError();
							$.ajax({
								url:gs_path+'/'+controller+'/id_auto',
								type:'POST',
								dataType:'JSON',
								}).done(function(data){
									$('#id_invoice').setval(data['id_invoice_auto']);
									$('#no_invoice').setval(data['no_invoice_auto']);
							});
							$('#dialog_container').dialog('open');
							$('#form_master').data('mode', 'create');
							$('#form_master').parent().parent().parent().prev().find('.panel-title').html('New Client Invoice Berlangganan');
							//$('#kode_kontrak').readonly(false);
							$('#no_invoice').readonly(false);
							$('#input_ppn').setval(10);
							$('#kode_kontrak, #kode_customer, #biaya_pendaftaran, #status, #keterangan, #no_invoice, #abodemen, #tanggal_invoice, #nama_jenis_barang, #bandwidth, #due_date, #periode_tagihan , #total , #ppn , #terbilang, #nama_customer').val('');
							$('#no_invoice').focus();
							$('#kode_kontrak').readonly(false);
						} },
						{ label: 'Edit', icon: 'edit', onclick: function() {
							var oSel=$('#datagrid').datagrid('getSelected'); 
							if(oSel==null){ alert('Please select row!'); }
							else{ 
								resetError();
								$('#dialog_container').dialog('open'); 
								$('#form_master').data('mode', 'edit');
								$('#form_master').parent().parent().parent().prev().find('.panel-title').html('Edit Client Invoice Berlangganan');
								$('#kode_kontrak').readonly(true);
								$('#id_invoice').setval(oSel['id_invoice']);
								$('#id_kontrak').setval(oSel['id_kontrak']);
								$('#input_ppn').setval(oSel['input_ppn']);
								jsonToForm(oSel); $('#kode_kontrak').focus();

								var kode_str = oSel['periode_tagihan'];
								var periode_tagihan_ = kode_str.split('-');
								$('#periode_bulan').setval(periode_tagihan_[0]);
								$('#periode_tahun').setval(periode_tagihan_[1]);
							} 
						} },
						{label: 'Delete', icon: 'delete', onclick: function() { 
							var oSel = $('#datagrid').datagrid('getSelected'); 
							if (oSel == null) { 
								$.messager.alert('&nbsp;', gs_msg_row_unselected, 'warning'); 
							} else { 
								deleteData(['id_invoice']);
							} 
						}}
						];
		setAction(buttons);
		
		
		$('#fm_search').focusFirst();
	});
//--><!]]></script>

<div id="tb" style="padding:5px;height:auto">
    <div>
        <form id="fm_search" onsubmit="grid_reload(); return false;">
        	<table class="tb_form" style="margin-bottom:0px">
            <tr>
            	<td width="100">Keyword</td>
                <td><input type="text" id="keyword" name="keyword" class="textfield medium" />
                	<a href="#" class="easyui-linkbutton" iconCls="icon-search" onclick="grid_reload(); return false;">Search</a>
                </td>
            </tr>
            </table>
        </form>
    </div>
</div>
<div id="datagrid" toolbar="#tb"></div>



<div id="dialog_container" style="padding:5px;width:600px;height:380px;">
	<form id="form_master">
    <table class="tb_form" style="width:100%;" cellpadding="0" cellspacing="0">
    <tr>
        <td>
        	<input id="id_invoice" name="id_invoice" type="hidden" />
        	<input id="id_kontrak" name="id_kontrak" type="hidden" />
        </td>
    </tr>
    <tr>
        <td class="label" style="width:150px">Kode Kontrak</td>
        <td><input id="kode_kontrak" /></td>
    </tr>
    <tr>
        <td class="label">Kode Client</td>
        <td><input id="kode_customer" /></td>
    </tr>
    <tr>
        <td class="label">Nama Client</td>
        <td><input id="nama_customer" /></td>
    </tr>
    <tr>
        <td class="label">No Invoice</td>
        <td><input id="no_invoice" /></td>
    </tr> 
    <tr>
        <td class="label">Tgl Invoice</td>
        <td><input id="tanggal_invoice" /></td>
    </tr>     
    <tr>
        <td class="label">Status</td>
        <td><select id="status" name="status">
        		<option value="Sudah Bayar">Sudah Bayar</option>
        		<option value="Belum Bayar">Belum Bayar</option>
        	 </select></td>
    </tr>
     <tr>
        <td class="label">Nama Jenis Produk</td>
        <td><input id="nama_jenis_barang" /></td>
    </tr>
     <tr>
        <td class="label">Bandwidth</td>
        <td><input id="bandwidth" /></td>
    </tr>
    <tr>
        <td class="label">Abodemen</td>
        <td><input id="abodemen" /></td>
    </tr> 
     <tr>
        <td class="label">PPN</td>
        <td><input id="ppn" /> Nominal Input PPN <input id="input_ppn" /> % </td>
    </tr>
    <tr>
        <td class="label"></td>
        <td>*Isikan nominal Input PPN jika ada perubahan (Defalut 10%)</td>
    </tr>
    <tr>
        <td class="label">Biaya Pendaftaran</td>
        <td><input id="biaya_pendaftaran" /></td>
    </tr>
    <tr>
        <td class="label"></td>
        <td>*Isikan angka 0 jika tidak ada Biaya Pendaftaran</td>
    </tr>
    <tr>
        <td class="label">Total</td>
        <td><input id="total" /></td>
    </tr>  
    <tr>
        <td class="label">Terbilang</td>
        <td><input id="terbilang" /></td>
    </tr>         
    <tr>
        <td class="label">Due Date Invoice</td>
        <td><input id="due_date" /></td>
    </tr>           
    <tr>
        <td class="label">Tanggal Bayar</td>
        <td><input id="tanggal_bayar" /></td>
    </tr> 
     <tr>
        <td class="label">Periode Tagihan</td>
        <td><select id="periode_bulan" name="periode_bulan">
        		<option value="Januari">Januari</option>
        		<option value="Februari">Februari</option>
        		<option value="Maret">Maret</option>
        		<option value="April">April</option>
        		<option value="Mei">Mei</option>
        		<option value="Juni">Juni</option>
        		<option value="Juli">Juli</option>
        		<option value="Agustus">Agustus</option>
        		<option value="September">September</option>
        		<option value="Oktober">Oktober</option>
        		<option value="November">November</option>
        		<option value="Desember">Desember</option>
        	 </select><?php
	            $now = date('Y');
	            $pastYear = $now - 10; 
	        	echo "<select id='periode_tahun' name='periode_tahun' >";
	        		for ($a=$pastYear;$a<=$now;$a++)
	        		{
	        			echo"<option value='".$a."''>".$a."</option>";	
	        		}
	        		 echo"</select>";
	        	?></td>
        	 
    </tr>
    <tr>
        <td class="label">Keterangan</td>
        <td><input id="keterangan" /></td>
    </tr>       
    </table>
	</form>
</div>